<template>
  <li>
    <h3>姓名是---{{p.name}}</h3>
    爱好是---<span v-for="item in p.hobby" :key="item">{{item}}</span>
  </li>
</template>

<script>
export default {
  name: 'Item',
  /* 
    我们需要通过props选项来接收父组件传递的props属性
    props的类型可以是一个数组
    我们一旦接收到了props属性 则会把属性直接放在组件实例上 供我们直接使用
  */
  props: ['p'],
  data() {
    return {
      count: 1
    }
  }
}
</script>

<style>
</style>